In its first iteration this is going to be rough. Hopefully within a few sweeps, it'll end up both useful for me, and for other people as a pointer for using 11ty to build sites. Because every tutorial I read and followed sort of sucked.

Beginners basic: Open up VSCode and Powershell 7. Navigate to the folder that houses the node_modules folder. Type in npm start, which works because you added a shortcut into the .eleventy.js file.

Jesus my code formatting sucks on this site.

My site is broken up into two types of files: the behind the scenes formatting, and the public facing content. Formatting files are labelled with a leading underscore. Public facing content is simply labelled with a hopefully relevant name. Two exceptions are index.md, which is the home page, and not_found.md, which is the 404 page.

YAML features:

• title - Set the title at the top of the screen, and usually the name of the post when linked from elsewhere.

• date - YYYY/MM/DD format. Call this in posts using {{ date | readableDate }} . Can also be used to reorder items, where the date is irrelevant.

• permalink - Used to force either a specified path for tidiness, or remove the link in situations where a post shouldn't have a path (for example the spoilered sections in the About pages).

• tags

  • If the tag matches the name of a title,
  • Header Button - Creates a header button link to the page

• blogpost-type

  • Thoughtful - sets colours for the blog page
  • Impulsive - sets colours for the blog page

• keywords - list of words to add as the keywords in a page's metadata

• layout - defaults to the home_layout.html setup. Can be overwritten by locating a different file

• coloursheet - defaults to colours.css. Can be changed to override specific segments of the colourscheme.

Page notes:

Blog page - If a page is tagged with